import React from "react"
import { Icon, Modal } from "antd"
import "./index.less"

const Loading = ({ pastDelay, timedOut, error }) => {
  if (pastDelay) {
    return (
      <Modal
        visible={true}
        wrapClassName="backgroundNone"
        closable={false}
        footer={null}
        bodyStyle={{ background: "none" }}
        style={{ textAlign: "center", background: "none" }}
      >
        <Icon
          type="loading"
          style={{ fontSize: 32, color: "#1890ff" }}
          theme="outlined"
        />
      </Modal>
    )
  } else if (timedOut) {
    return <div>Taking a long time...</div>
  } else if (error) {
    return <div>Error!</div>
  }
  return null
}

export default Loading
